<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>尚品特卖会</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <!-- Link Swiper's CSS -->
    <link rel="stylesheet" href="css/swiper.min.css">
    <link rel="stylesheet" href="css/animate.min.css">
    <link rel="stylesheet" href="style/index.css">
</head>
<body>
<!--<div class="loading">-->
<!--  <i>loading....</i>-->
<!--</div>-->
<!-- Swiper -->
<audio style="display: none" autoplay src="https://v.shangpin.com/m/Karaoke-Ameritz-Cosmic-Dancer.mp3"></audio>
<img class="music" src="img/donghua.gif" alt="">
<div class="swiper-container">
    <div class="swiper-wrapper">
        <div class="swiper-slide">
            <div class="img1">
                <i class="yaoqing"></i>
                <div>
                    <div>

                        <i class="title"></i>
                        <p></p>
                        <h6 class="header1"></h6>
                        <div class="body1"></div>
                        <div class="footer1"></div>
                        <div class="huadong1"></div>
                        <div class="xiahua_img"></div>
                    </div>

                </div>
            </div>
        </div>
        <div class="swiper-slide">
            <div class="img2">
                <i class="yaoqing"></i>
                <div>
                    <div>
                        <i class="title"></i>
                        <p></p>
                        <div class="body2"></div>
                        <div class="huadong2"></div>
                        <div class="xiahua_img"></div>
                    </div>

                </div>
            </div>
        </div>
        <div class="swiper-slide">
            <div class="img3">
                <i class="yaoqing"></i>
                <div>
                    <div>
                        <i class="title"></i>
                        <p></p>
                        <div class="body3"></div>
                        <div class="huadong2"></div>
                        <div class="xiahua_img"></div>
                    </div>

                </div>
            </div>
        </div>
        <div class="swiper-slide">
            <div class="img4">
                <i class="yaoqing"></i>
                <div>
                    <div>
                        <i class="title"></i>
                        <p></p>
                        <div class="youhouiquan"></div>
                        <div class="forms_">
                            <div><span>Step.1 分享朋友圈</span></div>
                            <p class="zhanwei1"></p>
                            <h5 class="test_code">
                                <input type="text" maxlength="11" placeholder="请输入手机号码">
                                <div>
                                    <b id="get_code">获取验证码</b>
                                    <span id="daojishi"></span>
                                </div>

                            </h5>
                            <p class="zhanwei2"></p>
                            <input placeholder="请输入验证码" type="text">
                        </div>
                        <div class="footer4"></div>
                        <div class="lijilingqu"></div>
                    </div>

                </div>
            </div>
        </div>
    </div>

</div>
<!-- Swiper JS -->
<script src="js/swiper.min.js"></script>
<script src="js/swiper.animate.min.js"></script>
<!-- Initialize Swiper -->
<script>
    (function () {
        var api = {
            //防止频繁操作
            old_click_time: 500,
            click_yes: function () {
                var now_tiem = new Date().getTime();
                if (now_tiem - this.old_click_time > 1000) {
                    this.old_click_time = now_tiem;
                    return true;
                } else {
                    return false;
                }
            },
            isIpad: function () {
                var ua = navigator.userAgent.toLowerCase();
                if (/ipad/i.test(ua)) {
                    return true;
                } else {
                    return false;
                }
            }
        };



        // window.onload=function () {
        //   setTimeout(function () {
        //     document.querySelector('.loading').style.display='none';
        //   },2000)
        //
        // };

        document.querySelector('body').style.minHeight = document.querySelector('body').clientHeight + 'px';
        if (api.isIpad()) {
            document.querySelector('body').style.maxWidth = '768px';
        }


        // 验证码操作start
        var e_get_code=document.getElementById('get_code');
        var e_daojishi=document.getElementById('daojishi');
        var time=59;
        var daojishi_n=time;
        e_get_code.onclick=function () {
            if(api.click_yes()){
                e_get_code.style.display='none';
                e_daojishi.style.display='block';
                e_daojishi.innerHTML=daojishi_n+'';

                var stop= setInterval(function () {
                    daojishi_n--;
                    e_daojishi.innerHTML=daojishi_n+'';
                    if(daojishi_n<0){
                        clearInterval(stop);
                        daojishi_n=time;
                        e_get_code.style.display='block';
                        e_daojishi.style.display='none';
                    }
                },1000);
            }
        };
        // 验证码操作end


        var mySwiper = new Swiper('.swiper-container', {
            direction: 'vertical',
            slidesPerView: 'auto',
            speed: 1000
        });
    }())


</script>
</body>
</html>
